 <template>
	<div class="app-contain">
		<div v-if="roomObj.type == 'playing'">
			<iframe name="submitFrame" width="100%" height="100%" src="about:blank"></iframe>
			<form action="https://view.csslcloud.net/api/view/login" method="post" target="submitFrame" ref="playLiveing">
				<input type="hidden" name="viewername"  :value="userInfo.name" />
				<input type="hidden" name="viewertoken"  :value="roomObj.roomCode" />
				<input type="hidden" name="roomid"  :value="roomObj.roomId" />
				<input name="userid" value="29F78BC79D335B5D" type="hidden">	
			</form>	
		</div>
		<div v-else>
			<iframe name="playbackFrame" width="100%" height="100%" src="about:blank"></iframe>
			<form action="http://view.csslcloud.net/api/view/callback/login" method="post" target="playbackFrame" ref="playback">
				<input type="hidden" name="viewername"  :value="userInfo.name" />
				<input type="hidden" name="viewertoken"  :value="roomObj.roomCode" />
				<input type="hidden" name="roomid"  :value="roomObj.roomId" />
				<input name="userid" value="29F78BC79D335B5D" type="hidden">	
				<input name="recordid" :value="roomObj.recordid" type="hidden">	
			</form>	
		</div>
		
		
	</div>
</template>

<script>
	export default {
		name: "liveRoom",
		data() {
			return {
				userInfo:{},
				roomObj:{}
			}
		},
		created(){
			let query = this.$route.query;
			let userInfo = this.getUserInfo();
			this.roomObj = query;
			this.userInfo = userInfo;
			
		},
		mounted() {
			if(this.roomObj.type=='playing'){
				this.$refs.playLiveing.submit();	
			}else{
				this.$refs.playback.submit();	
			}
			
		},
		methods:{
			
			getUserInfo() {
				return this.$store.getters.getStorageInfo;
			},
		}
	}
</script>

<style scoped>

	div{
		height:100%
	}
	
</style>